/**
 * image：模拟玻璃窗的图片元素，必须填写。
 * parentElement：canvas的父元素，如果不提供则默认为body。
 * crop：如果只使用图像的某一部分，用此参数提供坐标。如果不提供则默认为整幅图片。
 * blur：定义模糊的下雨雨滴效果。如果不提供值，默认为10。设置为0表示无模糊效果。
 * opacity：定义雨滴的透明度。如果不提供默认为1。
 */
//原版是纯JS的，我修改为了jQuery的。
$(function () {
    var image = document.getElementById('background');
    //var image = $("#background");
    image.onload = function () {
        var engine = new RainyDay({
            image: this,                // Image element
            // This value is required
            // parentElement: someDiv,  // Element to be used as a parent for the canvas
            // If not provided assuming the 'body' element
            //crop: [0, 0, 50, 60],     // Coordinates if only a part of the image should be used
            // If not provided entire image will be used
            blur: 10,                   // Defines blur due to rain effect
            // Assuming 10 if not provided
            // Use 0 value to disable the blur
            opacity: 1                  // Opacity of rain drops
            // Assuming 1 if not provided
        });
        engine.rain([[1, 2, 200]]);     // add 200 drops of size 1 - 2 ...
        engine.rain([
            [3, 3, 0.88],
            [5, 5, 0.9],
            [6, 2, 1]                   // ... and 1 drop of size from 6 - 8 ...
        ],
            100);                       // ... every 100ms
    };
    image.crossOrigin = 'anonymous';    // canvas裁剪需要跨域获取图片，但码云没有ACAO。
    image.src = 'https://i.loli.net/2018/05/17/5afd02d59f01f.jpg';  //于是用了博客园自己的文件上传，
                                                                    //但域名是files.cnblogs.com，
                                                                    //发现其实www开头也行
});